<template>
  <div class="addOrEdit">
    <div class="editHead" v-if="showAddOrEditType === 'edit'">
      <breadCrumb :titleArr="[$t('configLazyLoad.channel.enterpriseTip7'),$t('public.edit')]" @back="back"></breadCrumb>
      <el-tabs v-model="activeName">
        <el-tab-pane :label="$t('webchat.basicInfo')" name="baseInfo">
          <addOrEditForm 
            v-show="isShowAdd"
            :formInitData="configFormData"
            :showAddOrEditType="showAddOrEditType"
          ></addOrEditForm>
        </el-tab-pane>
        <el-tab-pane v-if="showAddOrEditType == 'edit'&&authMode=='dev'" :label="$t('configLazyLoad.channel.wexinTip19')" name="config">
          <enterpriseConfigInfo 
            :wechatUrl="wechatUrl"
            :configData="configFormData" 
            :showAddOrEditType="showAddOrEditType">
          </enterpriseConfigInfo>
        </el-tab-pane>
      </el-tabs>
    </div>
    <div class="addForm" v-if="showAddOrEditType === 'add'&&authMode=='provider'">
      <!-- <addOne v-if="currentStep=='one'"  @nextStep="nextStep"></addOne> -->
      <addTwo v-if="currentStep=='two'"  @nextStep="nextStep" :formData="formData" ></addTwo>
      <addThree v-if="currentStep=='three'"  @nextStep="nextStep" :formData="formData" ></addThree>
      <addFour v-if="currentStep=='four'"  @nextStep="nextStep" :_id="_id"></addFour>
      <!-- <enterpriseConfigInfo 
        v-if="!isShowAdd" 
        :configData="firstFormData" 
        :showAddOrEditType="showAddOrEditType">
      </enterpriseConfigInfo> -->
    </div>
    <div class="addForm" v-if="showAddOrEditType == 'add'&&authMode=='dev'">
      <addOrEditForm 
            v-if="isShowAdd"
            :showAddOrEditType="showAddOrEditType"
            @devNextStep="devNextStep"
            :wechatUrl="wechatUrl"
      ></addOrEditForm>
      <enterpriseConfigInfo 
        v-if="!isShowAdd" 
        :configData="firstFormData" 
        :showAddOrEditType="showAddOrEditType">
      </enterpriseConfigInfo>
    </div>
  </div>
</template>
<script>
import bus from '@/store/eventBus'
import breadCrumb from './../../../../ui-modules/breadCrumb/BreadCrumbConfig.vue'
import addOrEditForm from './addOrEditForm'
import addOne from './addOne'
import addTwo from './addTwo'
import addThree from './addThree'
import addFour from './addFour'
import enterpriseConfigInfo from './enterpriseConfigInfo'
export default {
  name: 'addOrEdit',
  data () {
    return {
      activeName: 'baseInfo',
      isShowAdd: true,
      currentStep: "two",
      firstFormData: {},
      agentid:"",
      corpid:"",
      formData:"",
      _id:"",
    }
  },
  props: {
    showAddOrEditType: {
      default: () => {
        return 'add'
      },
      type: String
    },
    authMode: {
      default: () => {
        return ''
      },
      type: String
    },
    configFormData: {
      type: Object,
      default: () => {
        return {}
      }
    },
    wechatUrl: {
      type: String,
      default: () => {
        return ''
      }
    }
  },
  methods: {
    back () {
      this.$emit('backFun')
    },
    nextStep (data) {
      this.currentStep=data
      // this.firstFormData = data
      // this.isShowAdd = false
    },
    devNextStep (data) {
      console.log("data",data);
      this.firstFormData = data
      this.isShowAdd = false
    },
    refresh(data){
      this.$store.dispatch('getWxEnterpriseById', {_id:data._id}).then(req => {
        
         this.formData = req.doc
      })
    },
  },
  beforeMount () {
  },
  mounted () {
    // this.fetchData()
    bus.$on('refreshWxworkAccessList', (data) => {
      this.refresh(data)
      this._id = data._id
    })
 
  },
  beforeDestroy () {
    bus.$off('refreshWxworkAccessList')

  },
  components: {
    breadCrumb,
    addOrEditForm,
    addOne,
    addTwo,
    addThree,
    addFour,
    enterpriseConfigInfo
  }
}
</script>
<style lang="stylus" scoped>
  @import "../../../../../assets/common.styl"
  .addForm
    text-align center
    margin 30px
</style>
